<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>歌曲列表</title>
    <style>


    </style>
    <link type="text/css" rel="stylesheet" href="https://unpkg.com/element-plus/dist/index.css"></link>
    <link rel="stylesheet" href="../style/style.css">
</head>
<body>
<div id="app">



</div>
</body>
<script src="https://unpkg.com/vue@3.3.4/dist/vue.global.js"></script>
<script src="https://unpkg.com/element-plus"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/Mock.js/1.0.0/mock-min.js"></script>
<script src="../data/index.js"></script>
<script type="module">

    import {Logo, Siderbar, BreadCrumb, QueryZone, MessageTable} from '../components/index.js'

    const app = {
        data() {
            return {
                menus: [],
                singers: [],
                cls_logo: 'logo'
            }
        },
        components: {
            Logo,
            Siderbar,
            BreadCrumb,
            QueryZone,
            MessageTable
        },
        mounted() {

            const that = this;
            $.ajax({
                url: 'http://test.org/menus',
                method: 'get',
                dataType: 'json',
                success: function (data) {
                    console.log(menus)
                    that.menus = data;


                }
            })

            $.ajax({
                url: 'http://test.org/singer/list',
                method: 'get',
                dataType: 'json',
                success: function (data) {
                    that.singers = data;
                    console.log(that.singers);

                }
            })


        }
    }

    Vue.createApp(app)
        .use(ElementPlus)
        .mount('#app')


</script>


</html>

</script>